<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Index-Mac</title>
    <link rel="stylesheet" href="/css/bootstrap.css">
    <!--<script src="https://libs.baidu.com/jquery/2.1.1/jquery.min.js"></script>-->
    <!--<script src="/js/bootstrap.min.js"></script>-->
    <!--<script src="/js/bootstrap-paginator.min.js"></script>-->
</head>
<body class="container">
<br>
<h1>Spring Boot And Mybatis<small> &nbsp;&nbsp;UserCount(<span th:text="${count}" />)</small></h1>
<br>
<!--<p class="text-danger">  In the development of paging function...</p>-->
<!--<br>-->
<div>
    <table class="table table-striped">
        <THEAD>
            <tr>
                <th>ID</th>
                <th>Name</th>
                <th>Password</th>
                <th>Role</th>
                <th>Edit</th>
                <th>Delete</th>
            </tr>
        </THEAD>
        <TBODY>
            <tr th:each = "user:${all}">
                <td th:text="${user.id}" ></td>
                <td th:text="${user.userName}" ></td>
                <td th:text="${user.passWord}" ></td>
                <td th:text="${user.realName}" ></td>
                <td ><a th:href="${'/edit/'+user.id}">edit</a></td>
                <td><a th:href="${'/del/'+user.id}" >delete</a></td>
            </tr>
        </TBODY>
    </table>
    <a class="btn btn-info" href="/toAdd" role="button">Add</a>
</div>
<!--<div id="example" style="text-align: center"> <ul id="pageLimit"></ul> </div>-->
<div id="example" style="text-align: center">
    <ul id="pageLimit" class="pagination">
        <li th:class="${indexPage==1}?'disabled' : ''"><a th:href="${indexPage!= 1}?'/?page='+${indexPage - 1} : 'javascript:;'">上一页</a></li>
        <li th:if="${indexPage - 3 >=1}" ><a th:href="@{'/?page=' + ${indexPage - 3}}" th:text="${indexPage - 3}" >1</a></li>
        <li th:if="${indexPage - 2 >=1}" ><a th:href="@{'/?page=' + ${indexPage - 2}}" th:text="${indexPage - 2}" >1</a></li>
        <li th:if="${indexPage - 1 >=1}" ><a th:href="@{'/?page=' + ${indexPage - 1}}" th:text="${indexPage - 1}" >1</a></li>
        <li class="active"><a href="javascript:;" th:text="${indexPage}" >1</a></li>
        <li th:if="${indexPage + 1 <= pageCount}" ><a th:href="@{'/?page=' + ${indexPage + 1}}" th:text="${indexPage + 1}" >1</a></li>
        <li th:if="${indexPage + 2 <= pageCount}" ><a th:href="@{'/?page=' + ${indexPage + 2}}" th:text="${indexPage + 2}" >1</a></li>
        <li th:if="${indexPage + 3 <= pageCount}" ><a th:href="@{'/?page=' + ${indexPage + 3}}" th:text="${indexPage + 3}" >1</a></li>
        <li th:class="${indexPage== pageCount}?'disabled' : ''" ><a th:href="${indexPage!= pageCount}?'/?page='+${indexPage + 1} : 'javascript:;'">下一页</a></li>
    </ul>
</div>
</body>
</html>